<template>
	<view class="container">
		<!-- 顶部区域信息卡片 -->
		<bus-card
			size="large"
			title="区域信息"
			v-for="(item, index) in deviceDataSource"
			:key="index"
		>
			<template slot="cardBody">
				<uni-row>
					<uni-col :span="16">
						<bus-card-item
							:showExpand="false"
							:columns="deviceColumns"
							:data="item"
						>
							<template slot="photo">
								<view class="photo-upload">
									<view class="label-short"
										><text>现场照片:</text></view
									>
									<view class="value">
										<uni-icons
											type="camera-filled"
											size="32"
											color="#405ee0"
											@click="handlePhoto()"
										></uni-icons>
										<text :style="{ color: '#405ee0' }">
											{{
												fileList && fileList
													? fileList.length
													: 0
											}}
										</text>
									</view>
								</view>
							</template>
						</bus-card-item>
					</uni-col>
					<uni-col :span="8">
						<image
							v-if="formData.groupStatus === '待执行'"
							class="excetImage"
							src="/static/exect.png"
							mode="aspectFill"
						/>
						<order-tag
							v-else
							:orderStatus="formData.groupStatus"
						></order-tag>
					</uni-col>
				</uni-row>
			</template>
		</bus-card>
		<!-- 执行数量展示 -->
		<view class="mid-content">
			<view class="left">
				<view
					>执行数量: {{ detailInfo.num }}/{{ detailInfo.total }}</view
				>
			</view>
		</view>
		<!-- 项目列表 -->
		<scroll-view class="scroll-view" scroll-y="true">
			<view class="project-list">
				<!-- 项目详情 -->
				<view class="detail-panel">
					<view
						v-for="(detail, detailIndex) in dataSource"
						:key="detail.id"
						class="detail-group"
					>
						<view class="item-value">
							<view class="detail-title">
								<view class="header-index">{{
									detailIndex + 1
								}}</view>
								<view>{{ detail.itemName }}</view>
							</view>
							<view class="detail-row">
								<view class="detail-row-item"
									>单位：<text>{{
										detail.unitName || '-'
									}}</text></view
								>
								<view class="detail-row-item"
									>目标值：<text>{{
										formatStandardValue(
											detail.standardValue,
										)
									}}</text></view
								>
							</view>
						</view>

						<!-- 实测值输入 -->
						<view class="input-group">
							<view class="label"><text>实测值</text></view>
							<view>
								<uni-data-checkbox
									v-if="detail.standardType == '1'"
									v-model="detail.measureValue"
									:localdata="dealResultOptions"
									@change="
										updateMeasureValue(detailIndex, $event)
									"
								/>
								<input
									v-else
									type="text"
									placeholder="请输入实测值"
									v-model="detail.measureValue"
									@input="validateMeasureValue(detailIndex, $event)"
									@change="
										updateMeasureValue(detailIndex, $event)
									"
									@confirm="
										updateMeasureValue(detailIndex, $event)
									"
								/>
							</view>
						</view>

						<!-- 异常照上传 -->
						<view
							class="photo-upload"
							v-if="
								detail.standardType == '1' &&
								detail.measureValue == '0'
							"
						>
							<view class="label"><text>异常照</text></view>
							<view class="value">
								<uni-icons
									type="camera-filled"
									size="32"
									color="#405ee0"
									@click="handleAbnormalPhoto(detailIndex)"
								></uni-icons>
								<text :style="{ color: '#405ee0' }">
									{{
										detail.imageList && detail.imageList
											? detail.imageList.length
											: 0
									}}
								</text>
							</view>
						</view>
						<view
							class="input-group"
							v-if="
								detail.standardType == '1' &&
								detail.measureValue == '0'
							"
						>
							<view class="label"><text>异常说明</text></view>
							<view>
								<input
									type="text"
									placeholder="请输入异常说明"
									v-model="detail.remark"
								/>
							</view>
						</view>
						<view
							class="photo-upload"
							v-if="
								detail.standardType == '0' &&
								detail.standardValue === '0'
							"
							v-for="(item, itemIndex) in detail.abnormalItemList"
							:key="itemIndex"
						>
							<view class="label"><text>异常编号</text></view>
							<view class="input-inner">
								<text class="text">第</text>
								<uni-easyinput
									type="number"
									v-model="item.groupId"
									:disabled="!!item.lock"
									@input="
										handleInput($event, item, 'groupId')
									"
								></uni-easyinput>
								<text class="text">组,第</text>
								<uni-easyinput
									type="number"
									v-model="item.itemId"
									:disabled="!!item.lock"
									@input="handleInput($event, item, 'itemId')"
								></uni-easyinput>
								<text class="text">根</text>
							</view>
							<view class="value">
								<uni-icons
									type="camera-filled"
									size="32"
									color="#405ee0"
									@click="
										handlePhotoItem(detailIndex, itemIndex)
									"
								></uni-icons>
								<text :style="{ color: '#405ee0' }">
									{{
										item.imageList && item.imageList
											? item.imageList.length
											: 0
									}}
								</text>
							</view>
						</view>
						<view
							class="photo-upload"
							v-if="
								detail.standardType == '3' &&
								detail.standardValue === '0'
							"
							v-for="(item, itemIndex) in detail.abnormalItemList"
							:key="itemIndex"
						>
							<view class="label"><text>异常部位</text></view>
							<view class="input-inner">
								<!-- <text class="text">第</text>
								<uni-easyinput
									type="number"
									v-model="item.groupId"
									:disabled="true"
								></uni-easyinput>
								<text class="text">组,第</text> -->
								<uni-data-select
									style="width: 100%"
									v-model="item.itemId"
									:disabled="!!item.lock"
									placeholder="请选择"
									:localdata="detail.standardValueList"
								></uni-data-select>
								<!-- <text class="text">根</text> -->
							</view>
							<view class="value">
								<uni-icons
									type="camera-filled"
									size="32"
									color="#405ee0"
									@click="
										handlePhotoItem(detailIndex, itemIndex)
									"
								></uni-icons>
								<text :style="{ color: '#405ee0' }">
									{{
										item.imageList && item.imageList
											? item.imageList.length
											: 0
									}}
								</text>
							</view>
						</view>
					</view>
				</view>
			</view>
		</scroll-view>

		<!-- 底部按钮 -->
		<view class="bottom-btn-normal" v-if="dataSource.length > 0">
			<button
				:loading="btnLoading"
				:disabled="btnLoading"
				size="mini"
				type="default"
				@click="handleStore"
			>
				暂存
			</button>
			<button
				:loading="btnLoading"
				:disabled="btnLoading"
				size="mini"
				type="primary"
				@click="handleSubmit"
			>
				提交
			</button>
		</view>

		<!-- 空状态 -->
		<view v-if="dataSource.length === 0">
			<empty-block></empty-block>
		</view>
	</view>
</template>

<script>
import {
	checkDetail,
	checkTemporaryStorage,
	checkSubmit,
	checkDetailInfo,
} from '@/api/check.js';
export default {
	name: '',
	data() {
		return {
			dealResultOptions: [
				{
					text: '是',
					value: '1',
				},
				{
					text: '否',
					value: '0',
				},
			],
			activeIndex: -1,
			dataSource: [],
			deviceDataSource: [],
			formData: {},
			btnLoading: false,
			executedNum: 0,
			executeTotalNum: 0,
			fileList: [],
			detailInfo: {},
		};
	},
	computed: {
		deviceColumns() {
			return [
				{ label: '区域编码', prop: 'areaCode' },
				{ label: '区域名称', prop: 'areaName' },
				{ label: '计划执行日期', prop: 'startDate' },
				{ label: '点检项目', prop: 'groupName' },
				{ label: '现场照片', slotName: 'photo' },
			];
		},
	},
	onLoad(option) {
		this.formData = JSON.parse(option.data);
		this.deviceDataSource = [this.formData];
		this.getList();
	},
	methods: {
				formatStandardValue(value) {
					// 检查是否为0（包含字符串'0'）
					if (value === 0 || value === '0') return 0;

					// 处理其他值
					return value || '-';
				},
			
				validateMeasureValue(detailIndex, event) {
					// 获取输入值
					let value = event.detail.value;
					
					// 如果值为空，不做处理
					if (!value) return;
					// 检查是否包含非法字符（除数字、负号和小数点外的字符）
					    if (/[^0-9.-]/.test(value)) {
					        // 显示提示信息
					        uni.showToast({
					            title: '只能输入数字',
					            icon: 'none',
					            duration: 1500
					        });
							//直接清空输入框 - 这里要确保清空操作执行
							this.$nextTick(() => {
							      this.$set(this.dataSource[detailIndex], 'measureValue', '');
							    });
							return ; // 直接返回，不执行后续逻辑
					    }
						else {
							// 如果没有非法字符，进行格式验证
							    // 确保只有一个小数点
							    value = value.replace(/\.(?=.*\.)/g, '');
							    // 确保负号只在开头
							    value = value.replace(/(?!^)-/g, '');
							    // 如果输入的值是 '-.' 或其他无效格式，重置为空
							    if (value === '-' || value === '.') value = '';
							    
							    // 更新值
							    this.$set(this.dataSource[detailIndex], 'measureValue', value);	
						}
					
				},

		// 校验不能填0
		handleInput(value, item, field) {
			// 将输入值转换为数字
			const numValue = Number(value);

			// 检查是否为0或无效数字
			if (numValue === 0 || isNaN(numValue)) {
				// 显示提示
				uni.showToast({
					title: `${field === 'groupId' ? '组号' : '根号'}不能为0`,
					icon: 'none',
					duration: 1500,
				});

				// 清空输入值
				this.$nextTick(() => {
					item[field] = '';
				});
			}
		},

		// 更新实测值（添加校验逻辑）
		updateMeasureValue(detailIndex, event) {
			const value = event.detail.value || '0';
			const currentItem = this.dataSource[detailIndex];
			// 定制加热炉逻辑
			if (
				currentItem.standardType == '3' &&
				(parseInt(value) < 0 ||
					parseInt(value) > currentItem.standardValueList?.length)
			) {
				uni.showToast({
					title: `实测值填写范围为[0, ${currentItem.standardValueList?.length}]`,
					icon: 'none',
					duration: 3000,
				});
				return;
			}

			// 检查是否数值类型且标准值为0
			if (
				currentItem.standardType === '0' &&
				currentItem.standardValue === '0'
			) {
				// 计算已锁定的异常项数量
				const lockedCount = currentItem.abnormalItemList
					? currentItem.abnormalItemList.filter(
							(item) => item.lock === 1,
					  ).length
					: 0;
				// 校验实测值是否小于已锁定项数量
				if (parseInt(value) < lockedCount) {
					uni.showToast({
						title: `实测值不能小于已锁定的异常项数量(${lockedCount})`,
						icon: 'none',
						duration: 3000,
					});
					this.$set(currentItem, 'measureValue', lockedCount);
					this.$set(
						currentItem,
						'abnormalItemList',
						currentItem.abnormalItemList.filter(
							(item) => item.lock === 1,
						),
					);
					return;
				}
			}

			// 更新 measureValue
			this.$set(currentItem, 'measureValue', value);

			// 处理标准值为0的情况
			if (currentItem.standardValue === '0') {
				const arrLen = Math.abs(value - 0);

				// 创建或更新 abnormalItemList
				const abnormalItemList = Array.from(
					{ length: arrLen },
					(_, i) => {
						// 保留已有的数据
						if (
							currentItem.abnormalItemList &&
							i < currentItem.abnormalItemList.length
						) {
							return currentItem.abnormalItemList[i];
						}
						return {
							groupId:
								currentItem.standardType === '3' ? '1' : null,
							itemId: null,
							imageList: null,
							lock: 0, // 默认未锁定
						};
					},
				);

				this.$set(currentItem, 'abnormalItemList', abnormalItemList);
			}
		},

		// 处理拍照
		handlePhoto() {
			const detail = {
				id: this.detailInfo.orderId,
				fileList: this.fileList,
			};
			uni.navigateTo({
				url:
					'/pages/jdCheck/addPhoto/index?data=' +
					JSON.stringify(detail),
				events: {
					addPhotoOk: (params) => {
						const { fileList } = params;
						this.fileList = fileList;
					},
				},
			});
		},
		handleAbnormalPhoto(detailIndex) {
			const detail = {
				...this.dataSource[detailIndex],
				fileList: this.dataSource[detailIndex].imageList,
			};
			uni.navigateTo({
				url:
					'/pages/jdCheck/addPhoto/index?data=' +
					JSON.stringify(detail),
				events: {
					addPhotoOk: (params) => {
						const { fileList } = params;
						this.$set(
							this.dataSource[detailIndex],
							'imageList',
							fileList,
						);
					},
				},
			});
		},
		handlePhotoItem(detailIndex, itemIndex) {
			const detail = {
				...this.dataSource[detailIndex].abnormalItemList[itemIndex],
				disabled:
					!!this.dataSource[detailIndex].abnormalItemList[itemIndex]
						.lock,
				fileList:
					this.dataSource[detailIndex].abnormalItemList[itemIndex]
						.imageList,
			};
			uni.navigateTo({
				url:
					'/pages/jdCheck/addPhoto/index?data=' +
					JSON.stringify(detail),
				events: {
					addPhotoOk: (params) => {
						const { fileList } = params;
						this.$set(
							this.dataSource[detailIndex].abnormalItemList[
								itemIndex
							],
							'imageList',
							fileList,
						);
					},
				},
			});
		},

		// 获取数据
		async getList() {
			const userInfor = uni.getStorageSync('userInfor');
			const res = await checkDetailInfo({
				startDate: this.formData.startDate,
				endDate: this.formData.endDate,
				areaId: this.formData.areaId,
				groupName: this.formData.groupName,
				planCode: this.formData.planCode,
				userNumber: userInfor.number,
			});

			const { data } = res || {};
			const { detailList, groupimageList, ...detailInfo } = data || {};
			this.dataSource = detailList || [];
			this.fileList = groupimageList || [];
			this.detailInfo = detailInfo;
		},

		// 暂存
		async handleStore() {
			this.btnLoading = true;
			try {
				const params = {
					...this.detailInfo,
					detailList: this.dataSource,
					groupimageList: this.fileList,
				};
				const res = await checkTemporaryStorage(params);

				if (res.code === 200) {
					uni.showToast({ title: '暂存成功', icon: 'success' });
					this.back();
				} else {
					uni.showToast({
						title: res.message || '暂存失败',
						icon: 'none',
					});
				}
			} catch (error) {
				uni.showToast({ title: '请求失败，请重试', icon: 'none' });
			} finally {
				this.btnLoading = false;
			}
		},

		// 提交
		async handleSubmit() {
			// 1. 检查网络状态
			try {
				const networkStatus = await this.$checkNetwork();
				if (networkStatus === 'disconnected') {
					uni.showToast({
						title: '当前无网络连接，请检查网络',
						icon: 'none',
					});
					return;
				}

				console.log(this.dataSource);
				// 2. 验证表单数据
				const hasError = this.dataSource.some(
					(project) => !project.measureValue,
				);

				// standardType 数值类型 照片校验
				const abnormalError = this.dataSource.some(
					(project) =>
						(project.standardType == '0' ||
							project.standardType == '3') &&
						project.standardValue === '0' &&
						project.abnormalItemList.some(
							(i) =>
								!i.groupId ||
								!i.itemId ||
								!i.imageList ||
								!i.imageList.length,
						),
				);

				// standardType 判断类型 照片校验
				const abnormalPhoto = this.dataSource.some(
					(project) =>
						project.standardType == '1' &&
						project.measureValue === '0' &&
						!project.imageList.length,
				);
				// 重复项检查逻辑
				const duplicateError = this.dataSource.some((project) => {
					const itemMap = new Map();
					return project.abnormalItemList.some((item) => {
						// 跳过未填写的项（由其他校验处理）
						if (!item.groupId || !item.itemId) return false;

						// 创建唯一键
						const key = `${item.groupId}-${item.itemId}`;

						// 检查是否已存在相同键
						if (itemMap.has(key)) {
							return true; // 发现重复
						}

						// 记录该键
						itemMap.set(key, true);
						return false;
					});
				});

				// 检查组号或根号是否为0（转换为数字后检查）
				const zeroValueError = this.dataSource.some((project) =>
					project.abnormalItemList.some(
						(item) =>
							Number(item.groupId) === 0 ||
							Number(item.itemId) === 0,
					),
				);

				console.log(
					hasError,
					abnormalError,
					abnormalPhoto,
					duplicateError,
				);

				if (
					hasError ||
					abnormalError ||
					abnormalPhoto ||
					duplicateError ||
					zeroValueError
				) {
					let errorMessage = '请检查以下问题：';

					if (hasError) {
						errorMessage += '\n- 未填实测值';
					}
					if (abnormalError) {
						errorMessage += '\n- 异常项未完整填写或未拍照';
					}
					if (abnormalPhoto) {
						errorMessage += '\n- 判断类型异常未拍照';
					}
					if (duplicateError) {
						errorMessage += '\n- 存在重复的异常项';
					}
					if (zeroValueError) {
						errorMessage += '\n- 组号或根号不能为0'; // 新增错误提示
					}
					uni.showModal({
						title: '提示',
						content: errorMessage,
						showCancel: false,
						confirmText: '知道了',
					});
					return;
				}

				// 3. 显示加载提示
				uni.showLoading({
					title: '正在提交...',
					mask: true,
				});

				// 4. 上传所有临时图片
				await this.uploadAllTempImages();

				// 5. 准备提交数据
				this.btnLoading = true;
				const params = {
					...this.detailInfo,
					detailList: this.dataSource.map((project) => ({
						...project,
						abnormalItemList: project.abnormalItemList.map(
							(item) => ({
								...item,
								imageList: item.imageList.map((img) => ({
									url: img.url,
								})),
							}),
						),
					})),
					groupimageList: this.fileList.map((file) => ({
						url: file.url,
					})),
				};
				let detailList = params.detailList
				if(detailList[0].fmsStatus === '2' || detailList[0].fmsStatus === '3') {
					if(params.groupimageList.length === 0) {
						let able = false
						for (const item of detailList) {
						    if (item.imageList.length > 0) {
						        able = true;
						        break;
						    }
						}
						console.log('able', able)
					if(!able) {
						uni.showModal({
							title: '提示',
							content: '现场照片不能为空！',
							showCancel: false,
							confirmText: '知道了',
						});
						return;
					}
					}
				}
				// 6. 提交表单
				const res = await checkSubmit(params);

				if (res.code === 200) {
					uni.showToast({ title: '提交成功', icon: 'success' });
					setTimeout(() => this.back(), 1500);
				} else {
					uni.showToast({
						title: res.message || '提交失败',
						icon: 'none',
					});
				}
			} catch (error) {
				console.error('提交失败:', error);
				uni.showToast({
					title: error.message || '提交失败，请重试',
					icon: 'none',
					duration: 3000,
				});
			} finally {
				this.btnLoading = false;
				uni.hideLoading();
			}
		},

		// 上传所有临时图片
		async uploadAllTempImages() {
			// 收集所有需要上传的临时图片
			const uploadTasks = [];

			// 处理分组图片
			this.fileList.forEach((file, index) => {
				if (file.status === 'temp') {
					uploadTasks.push(this.uploadImage(file, 'fileList', index));
				}
			});

			// 处理异常项图片
			this.dataSource.forEach((project, projectIndex) => {
				project.abnormalItemList.forEach((item, itemIndex) => {
					if (item.imageList && item.imageList.length > 0) {
						item.imageList.forEach((img, imgIndex) => {
							if (img.status === 'temp') {
								uploadTasks.push(
									this.uploadImage(
										img,
										'dataSource',
										projectIndex,
										itemIndex,
										imgIndex,
									),
								);
							}
						});
					}
				});
			});

			// 处理是否的异常照
			this.dataSource.forEach((project, projectIndex) => {
				if (project.imageList && project.imageList.length > 0) {
					project.imageList.forEach((img, imgIndex) => {
						if (img.status === 'temp') {
							uploadTasks.push(
								this.uploadImage(
									img,
									'dataSourceH',
									projectIndex,
									undefined,
									imgIndex,
								),
							);
						}
					});
				}
			});

			// 如果没有需要上传的图片，直接返回
			if (uploadTasks.length === 0) return;

			// 执行所有上传任务
			await Promise.all(uploadTasks);
		},

		// 上传单个图片
		async uploadImage(img, context, projectIndex, itemIndex, imgIndex) {
			try {
				// 上传图片
				const res = await uni.uploadFile({
					url: baseUrl + '/alone/uploadImages',
					name: 'file',
					filePath: img.url, // 临时路径
					header: {
						userToken: getToken(),
					},
				});
				console.log('res-uploadImage====>', res);
				if (res.statusCode !== 200) {
					throw new Error(`上传失败，状态码: ${res.statusCode}`);
				}

				if (res.statusCode !== 200) {
					throw new Error(res.errMsg || '上传失败');
				}

				// 更新图片URL
				const newUrl = res.data;

				// 根据上下文更新对应的图片对象
				switch (context) {
					case 'fileList':
						this.$set(this.fileList, projectIndex, {
							...this.fileList[projectIndex],
							url: newUrl,
							status: 'uploaded',
						});
						break;

					case 'dataSource':
						this.$set(
							this.dataSource[projectIndex].abnormalItemList[
								itemIndex
							].imageList,
							imgIndex,
							{
								...this.dataSource[projectIndex]
									.abnormalItemList[itemIndex].imageList[
									imgIndex
								],
								url: newUrl,
								status: 'uploaded',
							},
						);
						break;
					case 'dataSourceH':
						this.$set(
							this.dataSource[projectIndex].imageList,
							imgIndex,
							{
								...this.dataSource[projectIndex].imageList[
									imgIndex
								],
								url: newUrl,
								status: 'uploaded',
							},
						);
						break;
				}

				return newUrl;
			} catch (error) {
				console.error('图片上传失败:', error);

				// 根据上下文标记错误状态
				switch (context) {
					case 'fileList':
						this.$set(this.fileList, projectIndex, {
							...this.fileList[projectIndex],
							status: 'error',
						});
						break;

					case 'dataSource':
						this.$set(
							this.dataSource[projectIndex].abnormalItemList[
								itemIndex
							].imageList,
							imgIndex,
							{
								...this.dataSource[projectIndex]
									.abnormalItemList[itemIndex].imageList[
									imgIndex
								],
								status: 'error',
							},
						);
						break;
					case 'dataSourceH':
						this.$set(
							this.dataSource[projectIndex].imageList,
							imgIndex,
							{
								...this.dataSource[projectIndex].imageList[
									imgIndex
								],
								url: newUrl,
								status: 'error',
							},
						);
						break;
				}

				throw error;
			}
		},

		// 返回上一页
		back() {
			setTimeout(() => {
				this.btnLoading = false;
				uni.navigateTo({
					url: '/pages/jdCheck/index',
				});
			}, 1500);
		},
	},
};
</script>

<style scoped lang="scss">
.project-list {
	margin-bottom: 20px;
	padding: 8px;
	padding-bottom: 30px;
}

.project-icon {
	height: 20px;
	width: 4px;
	background: var(--primary-color);
	position: absolute;
	left: -10px;
	top: 0;
}

.project-item {
	background-color: #ffffff;
	border-radius: 10px;
	margin-bottom: 10px;
	overflow: hidden;
}

.project-header {
	display: flex;
	padding: 15px;
	align-items: center;
	border-bottom: 1px solid #eee;
	background: #ebeffd;
}

.project-info {
	flex: 1;
}

.project-title {
	font-size: 18px;
	font-weight: bold;
	margin-bottom: 5px;
	position: relative;
	display: flex;
	align-items: center;
	gap: 8px;
}

.project-code,
.project-indicators {
	font-size: 14px;
	color: #666;
	margin-bottom: 3px;
}

.project-status {
	min-width: 80px;
	text-align: center;
}

.status-button {
	background: var(--primary-color);
	color: #ffffff;
	font-size: 14px;
	padding: 4px 8px;
	border-radius: 4px;
}

.detail-panel {
	padding: 3px;
	padding-top: 0;

	.detail-group {
		padding: 12px;
		border-bottom: 1px solid #eee;
	}
}

.detail-title {
	font-weight: bold;
	margin-bottom: 10px;
	display: flex;
	align-items: center;

	.header-index {
		height: 20px;
		width: 20px;
		border-radius: 50%;
		background: #405ee0;
		color: #ffffff;
		margin-right: 8px;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 12px;
	}
}

.detail-row {
	margin-bottom: 10px;
	color: #666;
	display: flex;
	flex-wrap: wrap;
	gap: 12px;

	.detail-row-item {
		min-width: 45%;
	}
}

.item-value {
	background: #f2f2f2;
	padding: 8px 12px;
	border-radius: 4px;
}

.input-group {
	margin: 15px 0;
	display: flex;
	align-items: center;

	.label {
		width: 90px;
		font-weight: bold;
	}

	.input-inner {
		display: flex;
		align-items: center;
		flex: 1;
		.text {
			padding: 0 3px;
		}
	}

	input {
		flex: 1;
		height: 40px;
		padding: 0 10px;
		border: 1px solid #ddd;
		border-radius: 5px;
	}
}

.photo-upload {
	display: flex;
	align-items: center;
	margin-bottom: 6px;

	.label {
		width: 82px;
		font-weight: bold;
	}

	.input-inner {
		display: flex;
		align-items: center;
		flex: 1;
		.text {
			padding: 0 3px;
		}
	}

	.value {
		display: flex;
		align-items: center;
	}
}

.mid-content {
	display: flex;
	justify-content: space-between;
	padding: 0 16rpx;
	padding-top: 12px;

	.left {
		display: flex;
		font-weight: 600;
		> view:first-child {
			margin-right: 16px;
		}
	}
}

.excetImage {
	width: 100px;
	height: 100px;
}
</style>
